window.addEventListener('load', function(){
    var newshd = document.querySelector('.news-hd');
    var focus = newshd.querySelector('.focus');
    var imgul = newshd.querySelector('.img');
    var imgnum = imgul.children.length
    for(var i = 0; i < imgnum;i++) {
        var li = document.createElement('li');
        li.setAttribute('index', i);
        focus.appendChild(li);
        li.addEventListener('click',function(e) {
            for(var i = 0; i < imgnum;i++) {
                focus.children[i].className = '';
            }
            circle=this.getAttribute('index');
            num=this.getAttribute('index')
            this.className = 'current'
            console.log(imgul.children[0].offsetWidth);
            animate(imgul,-imgul.children[0].offsetWidth*this.getAttribute('index'))
        })
    }
    focus.children[0].className='current';
    var first = imgul.children[0].cloneNode(true);
    imgul.appendChild(first);
    var arrl = document.querySelector('.arrl')
    var arrr = document.querySelector('.arrr')
    newshd.addEventListener('mouseover',function(e) {
        arrl.style.display='block'
        arrr.style.display='block'
        clearTimeout(timer)
        timer=null
    })
    newshd.addEventListener('mouseout',function(e) {
        arrl.style.display='none'
        arrr.style.display='none'
        timer = setInterval(function() {
            arrr.click()
        },2000)
    })
    var num=0;
    var circle = 0;
    var flag = true;
    arrr.addEventListener('click',function(e) {     
        if(flag) {
            flag = false;
            if(num==imgnum){
                num=0;
                imgul.style.left=0;
            }
            num++;
            circle++;
            if(circle==imgnum){
                circle=0;
            }
            for(var i = 0; i < imgnum;i++) {
                focus.children[i].className = '';
            }
            focus.children[circle].className='current';
            animate(imgul,-imgul.children[0].offsetWidth*num,function(){
                flag = true;
            });
        }
    })
    arrl.addEventListener('click',function(e) {     
        if(flag) {
            if(num==0){
                num=imgnum;
                imgul.style.left=-imgul.children[0].offsetWidth*(imgnum)+'px';
            }
            num--;
            circle--;
            if(circle<0){
                circle=imgnum-1;
            }
            for(var i = 0; i < imgnum;i++) {
                focus.children[i].className = '';
            }
            focus.children[circle].className='current';
            animate(imgul,-imgul.children[0].offsetWidth*num,function(){
                flag = true;
            });
        }
    })
    var timer = this.setInterval(function() {
        arrr.click()
    },2000)
    function animatey(obj, target, callback) {
        // 先清除以前的定时器，只保留当前的一个定时器执行
        clearInterval(obj.timer);
        obj.timer = setInterval(function() {
            // 步长值写到定时器的里面
            // 把我们步长值改为整数 不要出现小数的问题
            // var step = Math.ceil((target - obj.offsetLeft) / 10);
            var step = (target - window.pageYOffset) / 10;
            step = step > 0 ? Math.ceil(step) : Math.floor(step);
            if (window.pageYOffset == target) {
                // 停止动画 本质是停止定时器
                clearInterval(obj.timer);
                callback && callback();
            }
            // 把每次加1 这个步长值改为一个慢慢变小的值  步长公式：(目标值 - 现在的位置) / 10
            window.scroll(0,window.pageYOffset + step)
        }, 15);
    }
    
    var celan = document.querySelector('.celan')
    celan.addEventListener('click', function(e) {
        animatey(window,0)
    })
    window.addEventListener('scroll', function(e) {
        if(window.pageYOffset >= 850){
            celan.style.display="block"
        }
        else{
            celan.style.display="none"
        }
    })
})